﻿{extend name="public:base" /}

{block name="css"}
<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css"/>
<link rel="stylesheet" type="text/css" href="__ADMIN__/css/style.css">{/block}{block name="content"}

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox ">
                <div class="ibox-content">
                    <form method="post">
                        <div class="box-item">
                            <div class="form-group row">
                                <label class="col-sm-1 col-form-label">微信用户手机号</label>
                                <div class="col-sm-3">
                                    <input type="text" class="form-control mobile" maxlength="11" placeholder="请输入微信用户手机号">
                                </div>
                            </div>
                        </div>
                        <div class="box-item">
                            <div class="form-group row">
                                <label class="col-sm-1 col-form-label">微信昵称</label>
                                <div class="col-sm-3">
                                    <input type="text" class="form-control nickname" placeholder="" readonly>
                                </div>
                            </div>
                        </div>
                        <div class="box-item">
                            <div class="form-group row">
                                <label class="col-sm-1 col-form-label">姓名</label>
                                <div class="col-sm-3">
                                    <input type="text" class="form-control username" placeholder="" readonly>
                                </div>
                            </div>
                            <input type="hidden" class="user_id" value="0">
                            <div class="hr-line-dashed"></div>
                        </div>

                        <div class="box-item">
                            <div class="form-group row layui-form">
                                <label class="col-sm-1 col-form-label">服务</label>
                                <div class="col-sm-3">
                                    <select class="service_id">
                                        <option value="0">请选择服务</option>
                                        {volist name="service_list" id="vo"}
                                        <option value="{$vo.id}">{$vo.name}</option>
                                        {/volist}
                                    </select>
                                </div>
                            </div>
                            <div class="hr-line-dashed"></div>
                        </div>

                        <div class="form-group row">
                            <div class="col-sm-4 col-sm-offset-2">
                                <button type="button" class="btn btn-w-m btn-primary pay">确认授权</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

{/block}

{block name='js'}
<script src="/static/layui/layui.js"></script>
<script>
    $('.mobile').on('input', function () {
        var mobile = $(this).val();

        if (mobile.length == 11) {
            $.post("{:url('/admin/manage/bindUser')}", {mobile, type: 1}, res => {
                if (res.result == 1) {
                    $('.nickname').val(res.data.nickname);
                    $('.username').val(res.data.username);
                    $('.user_id').val(res.data.id);
                } else {
                    $('.nickname').val('');
                    $('.username').val('');
                    $('.user_id').val(0);
                    layer.msg(res.msg, {icon: 2});
                }
            }, 'json');
        }
    });

    $('.pay').on('click', function () {
        var user_id = $('.user_id').val();
        var service_id = $('.service_id').val();

        if (user_id == 0) {
            layer.msg('请输入正确的用户手机号', {icon: 2});
            return false;
        }
        if (service_id == 0) {
            layer.msg('请选择服务', {icon: 2});
            return false;
        }

        swal({
            title: "您确认要执行该操作吗？",
            type: "warning",
            cancelButtonText: '取消',
            showCancelButton: true,
            confirmButtonColor: "#1BBF80",
            confirmButtonText: "确认",
            closeOnConfirm: false
        }, function () {
            // 加载层
            var index = layer.load(2, {shade: [0.2, '#000']});

            $.post("{:url('/admin/manage/payService')}", {user_id, service_id}, res => {
                if (res.result == 1) {
                    // 授权成功
                    layer.close(index);
                    layer.msg(res.msg, {icon: 1});

                    setTimeout(function () {
                        window.location.reload();
                    }, 1000)
                } else if (res.result == 2) {
                    layer.close(index);
                    layer.msg(res.msg, {icon: 2});
                }
            }, 'json');

            setTimeout(function () {
                layer.close(index);
            }, 3000)
        });
        return false;
    })


</script>{/block}
